<template>
  <div class="main">
    <div class="head-img" :style="{ width: size, height: size }">
      <img :src="src" alt="">
    </div>
  </div>
</template>

<script setup>
const props = defineProps({
  src: {
    type: String,
    default: '',
    required: true,
  },
  size: {
    type: String,
    default: '30px',
  }
})
</script>

<style lang="less" scoped>
.head-img {
  border: 2px solid #fff;
  border-radius: 50%;
  box-shadow: 3px 3px 3px #919191;
  overflow: hidden;

  img {
    display: block;
    width: 100%;
    min-height: 100%;
  }
}
</style>